<template>
  <div>
    <h3>测试批量导入组件</h3>
    <myexcel></myexcel>
    <h3> 测试存储桶</h3>
    <input ref="myinput"  type="file" @change="mychange">
     <img :src="url" alt="" />

     <h3>测试上传图片组件最新</h3>
    
<imgupload :imgUrl.sync='imgUrl'></imgupload>
  </div>
</template>

<script>
import COS from "cos-js-sdk-v5";

export default {
  data() {
    return {
      cosobj: null,
      url: "",
      imgUrl:
        "https://img0.baidu.com/it/u=1714637088,3863322727&fm=26&fmt=auto&gp=0.jpg"
    };
  },
  methods: {
    mychange() {
      console.log(this.$refs.myinput.files[0]);
      const file = this.$refs.myinput.files[0];
      this.cosobj.putObject(
        {
          Bucket: "dym-1307224130" /* 必须 */,
          Region: "ap-nanjing" /* 存储桶所在地域，必须字段 */,
          Key: file.name /* 必须 */,
          StorageClass: "STANDARD",
          Body: file, // 上传文件对象
          onProgress: progressData => {
            // progressData: 上传过程中的实时进度对象
            console.log(JSON.stringify(progressData));
          }
        },
        (err, data) => {
          // data:上传成功后的返回值
          // err:上传出错的错误信息
          console.log(err || data);
          this.url = "http://" + data.Location;
        }
      );
    }
  },
  created() {
    this.cosobj = new COS({
      SecretId: "AKIDDF2XnnW3LM6anjNmvnOhjVzDAqFNEo78", // 身份识别 ID
      SecretKey: "lFTP4TbR1LOAeroTrypBG4cttb2E9m8E" // 身份密钥
    });
  }
};
</script>

<style></style>
